<template>
    <div class="kickback_header">
        <div class="left">
            <div>可提现(元): <span>{{ Payouts }}</span></div>
            <div>累计提现(元): <span>{{ NoPayouts }}</span></div>
        </div>
        <div class="right" @click="save">
            立即提现
        </div>
    </div>
    <!-- 下拉刷新 -->
    <van-pull-refresh v-model="refreshing" :head-height="80" @refresh="refresh">
         <!-- 加载列表 -->
         <van-list
            v-model:loading="loading"
            :finished="finished"
            :offset="8"
            :immediate-check="false"
            finished-text="到底咯..."
            @load="load"
        >
            <div class="kickback">
                <div class="item" v-for="(item,key) in list" :key="key">
                    <div class="left">
                        <div class="img">
                            <img :src="item.business.avatar_text" alt="">
                        </div>
                        <div class="content">
                            <div class="nickname">订单号：{{ item.product_order.code }}</div>
                            <div class="tel">客户电话：{{  item.business.mobile}}</div>
                        </div>
                    </div>
                    <div class="right">
                        <div v-if="item.status==1" class="status">待结算</div>

                        <div v-else class="status">已结算</div>
                        <div class="money">+{{ item.amount }}</div>
                    </div>
                </div>
            </div>
    
        </van-list>
        
    </van-pull-refresh>
    
    <!-- 返回顶部 -->
    <van-back-top />
    <Tabbar />
</template>
<script setup>

    const {proxy} = getCurrentInstance();//页面的this
    let list = ref([]);
    let refreshing = ref(false);//下拉刷新
    let finished = ref(false);//是否无更多数据
    let loading = ref(false);//加载状态
    let page = ref(1);//分页
    let Payouts = ref(0)//提现总数
    let NoPayouts = ref(0)//未提现总数
    let busid = proxy.$business.value.id;
    // 页面加载时调用load方法
    onMounted(()=>{
        load()
    })
    //下拉刷新
    const refresh = async ()=>{
        setTimeout(() => {
            //每次刷新的时候把页数置为1
            page.value = 1;
            list.value = [];
            finished.value = false;
            loading.value = true;
            // 在此加载load方法
            load()
      }, 1000);
    }
    const load = async ()=>{

        //传递busid就行
        //上拉刷新 下拉加在
        //判断是否为加载中的状态
        if(refreshing.value){
            refreshing.value = false
        }
        //发送请求
        var result = await proxy.$POST({
            url:'/sale/money',
            params:{busid:busid,page:page.value}
        })
        loading.value = false//请求完毕后加载一下

        if(!result) return false
        if(result.code == 0){
            //提醒到底了
            finished.value = true;
            return false
        }
        page.value++; //页数改变
        //返回的值合并一下
        // console.log(result.data)
        // 合并数组
        list.value = list.value.concat(result.data.list)
        Payouts.value = result.data.Payouts
        NoPayouts.value = result.data.NoPayouts
    }
    //全部提现
    const save = async ()=>{
         //发送请求
         var result = await proxy.$POST({
            url:'/sale/save',
            params:{busid:busid}
        })
        if(result.code == 0){
            proxy.$fail(result.msg);
            return false
        }
        proxy.$success({
            message:result.msg,
            duration:1000,
            onClose:()=>proxy.$router.go(0)
        })
    }



</script>

<style scoped>
    @import url('/assets/css/SaleMoney.css');
</style>